// 基于svg.js的SVG扫描工具
import SVG from 'svg.js'

/**
 * 使用svg.js扫描SVG元素（优化版本）
 * @param {string} svgText - SVG文本内容
 * @param {Object} options - 扫描选项
 * @returns {Promise<Array>} 扫描结果
 */
export const scanSvgWithLibrary = async (svgText, options = {}) => {
  return new Promise((resolve, reject) => {
    try {
      // 创建临时容器
      const tempDiv = document.createElement('div')
      tempDiv.style.position = 'absolute'
      tempDiv.style.left = '-9999px'
      tempDiv.style.top = '-9999px'
      tempDiv.style.visibility = 'hidden'
      tempDiv.innerHTML = svgText
      document.body.appendChild(tempDiv)
      
      // 使用svg.js解析
      const svgElement = tempDiv.querySelector('svg')
      if (!svgElement) {
        throw new Error('无效的SVG文件')
      }
      
      // 创建SVG实例
      const svg = SVG(svgElement)
      
      const results = []
      const batchSize = options.batchSize || 20 // 更小的批次
      const isLargeFile = svgText.length > 1000000
      
      console.log(`SVG文件大小: ${svgText.length} 字符，大文件: ${isLargeFile}`)
      
      // 定义可绑定的选择器（只扫描有ID的元素）
      const bindableSelectors = isLargeFile 
        ? ['text[id]', 'rect[id]', 'circle[id]', 'path[id]', 'g[id]']
        : ['text[id]', 'rect[id]', 'circle[id]', 'path[id]', 'g[id]', 'polygon[id]', 'line[id]']
      
      // 先计算总元素数量
      let totalElements = 0
      const allElements = []
      
      bindableSelectors.forEach(selector => {
        const elements = svgElement.querySelectorAll(selector)
        allElements.push(...Array.from(elements))
        totalElements += elements.length
      })
      
      console.log(`找到 ${totalElements} 个有ID的元素`)
      
      let processedCount = 0
      
      // 分批处理所有元素
      const processBatch = async (startIndex) => {
        if (startIndex >= allElements.length) {
          // 处理完成
          document.body.removeChild(tempDiv)
          resolve(results)
          return
        }
        
        const batch = allElements.slice(startIndex, startIndex + batchSize)
        
        // 处理当前批次
        batch.forEach(element => {
          const elementInfo = createElementInfo(element)
          if (elementInfo) {
            results.push(elementInfo)
          }
          processedCount++
        })
        
        // 更新进度
        if (options.onProgress) {
          const progress = Math.round((processedCount / totalElements) * 100)
          options.onProgress(progress, processedCount, totalElements)
        }
        
        // 让出控制权，避免阻塞UI
        await new Promise(resolve => setTimeout(resolve, 0))
        
        // 处理下一批次
        processBatch(startIndex + batchSize)
      }
      
      // 开始处理
      processBatch(0)
      
    } catch (error) {
      // 清理临时元素
      const tempDiv = document.querySelector('div[style*="position: absolute"]')
      if (tempDiv && tempDiv.parentNode) {
        tempDiv.parentNode.removeChild(tempDiv)
      }
      reject(error)
    }
  })
}

/**
 * 创建元素信息对象
 */
function createElementInfo(element) {
  const id = element.id
  if (!id) return null
  
  const type = element.tagName.toLowerCase()
  const text = element.textContent ? element.textContent.trim() : ''
  
  // 生成显示名称
  let displayName = ''
  if (text && text.length > 0 && text.length < 50) {
    displayName = text
  } else if (id.includes('AH') || id.includes('BH')) {
    displayName = id
  } else {
    displayName = `${type}_${id}`
  }
  
  return {
    id: id,
    type: type,
    displayName: displayName,
    isBound: false,
    binding: {
      dataSourceId: '',
      pointId: '',
      displayType: 'value'
    }
  }
}

/**
 * 使用虚拟滚动优化大量元素显示
 */
export const createVirtualScrollList = (container, items, itemHeight = 60) => {
  const visibleCount = Math.ceil(container.clientHeight / itemHeight)
  const totalHeight = items.length * itemHeight
  
  let scrollTop = 0
  let startIndex = 0
  let endIndex = Math.min(startIndex + visibleCount, items.length)
  
  const updateVisibleItems = () => {
    startIndex = Math.floor(scrollTop / itemHeight)
    endIndex = Math.min(startIndex + visibleCount, items.length)
    
    // 只渲染可见的元素
    const visibleItems = items.slice(startIndex, endIndex)
    return visibleItems
  }
  
  const onScroll = (e) => {
    scrollTop = e.target.scrollTop
    updateVisibleItems()
  }
  
  container.addEventListener('scroll', onScroll)
  
  return {
    updateVisibleItems,
    destroy: () => {
      container.removeEventListener('scroll', onScroll)
    }
  }
}
